{extend name="admin@public/basic" /}

{block name="style"}
<!-- <link rel="stylesheet" href="__STATIC__/css/admin/login.css" media="all"> -->
<style>
    .layadmin-backlog-body p em {
        font-style: normal;
        font-size: 30px;
        font-weight: 300;
        color: #0f4c81 !important;
    }

    .layadmin-backlog-body cite {
        padding-bottom: 10px;
        font-size: 12px;
        font-weight: 500;
        color: #333;
    }
    .bg_6b5af4{
        background-size: auto 100%;
        background-position: right bottom;
        background-repeat: no-repeat;
        border: solid #DEDEDE 1px;
    }

    .width_33{
        width:25%;
    }
    .statistic{ color: rgba(100, 93, 93, 1);margin-top: 20px;margin-bottom: 0px; }
    .statistic .bg_block { border-radius: 8px;padding: 20px 15px; }
    .statistic .title{ font-size: 20px; }
    .statistic .total_statistic{ font-size: 50px;text-align: center;margin: 10px 0; }
    .statistic .today_statistic{ font-size: 14px;opacity: 0.8; }
    .card_border_radius{ border-radius: 8px; }
    .echarts_title{ font-size: 16px;font-weight: bold; padding: 20px 5px 15px; }
</style>
{/block}

{block name="cotent"}


{/block}

{block name="script"}
<div style="padding: 20px; background-color: #F2F2F2;">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md12">
            2020年2月11日 星期二 晴
        </div>

    </div>

    <div class="layui-fluid">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md8">
            <div class="layui-card">
                <div class="layui-card-header">数据统计</div>
                <div class="layui-card-body">
                    <ul class="layui-row layui-col-space15 statistic">


                        <li class="layui-col-xs2 width_33">
                            <div class="bg_block bg_6b5af4">
                                <span class="title">用户<i class="layui-icon layui-icon-about" style="font-size: 20px; color: #DEDEDE;"data-d="用户总数" onmouseover="show_shopm(this)"></i></span>
                                <p class="total_statistic">1</p>
                               <span class="today_statistic">今日新增：2</span>
                            </div>
                        </li>

                        <li class="layui-col-xs2 width_33">
                            <div class="bg_block bg_6b5af4">
                                <span class="title">企业<i class="layui-icon layui-icon-about" style="font-size: 20px; color: #DEDEDE;"data-d="用户总数" onmouseover="show_shopm(this)"></i></span>
                                <p class="total_statistic">3</p>
                                <span class="today_statistic">今日新增：2</span>
                            </div>
                        </li>

                        <li class="layui-col-xs2 width_33">
                            <div class="bg_block bg_6b5af4">
                                <span class="title">设备<i class="layui-icon layui-icon-about" style="font-size: 20px; color: #DEDEDE;"data-d="用户总数" onmouseover="show_shopm(this)"></i></span>
                                <p class="total_statistic">3</p>
                                <span class="today_statistic">今日安装：4</span>
                            </div>
                        </li>
                        <li class="layui-col-xs2 width_33">
                            <div class="bg_block bg_6b5af4">
                                <span class="title">收入<i class="layui-icon layui-icon-about" style="font-size: 20px; color: #DEDEDE;"data-d="用户总数" onmouseover="show_shopm(this)"></i></span>
                                <p class="total_statistic">3</p>
                                <span class="today_statistic">今日收入：4</span>
                            </div>
                        </li>
                    </ul>

            </div>

        </div>

        </div>
        <div class="layui-col-md4">
            <div class="layui-card">
                <div class="layui-card-header">近日动态</div>
                <div class="layui-card-body">
                    <div class="layui-carousel" id="test1">
                        <div carousel-item>
                            <div>条目1</div>
                            <div>条目2</div>
                            <div>条目3</div>
                            <div>条目4</div>
                            <div>条目5</div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="layui-card">
                <div class="layui-tab layui-tab-brief layadmin-latestData">
                    <ul class="layui-tab-title">
                        <li class="layui-this">设备排行榜</li>
                        <li>服务费排行榜</li>
                    </ul>
                    <div class="layui-tab-content">
                        <div class="layui-tab-item layui-show">
                            <table class="layui-table">
                                <colgroup>
                                    <col width="50%">
                                    <col width="50%">
                                </colgroup>
                                <tbody>
                                <tr>
                                    <td>企业名称</td>
                                    <td>设备数</td>
                                </tr>

                                <tr>
                                    <td>优合一众</td>
                                    <td>200</td>
                                </tr>

                                </tbody>
                            </table>
                        </div>
                        <div class="layui-tab-item">
                            <table class="layui-table">
                                <colgroup>
                                    <col width="50%">
                                    <col width="50%">
                                </colgroup>
                                <tbody>
                                <tr>
                                    <td>企业名称</td>
                                    <td>服务费/元</td>
                                </tr>

                                <tr>
                                    <td>优合一众</td>
                                    <td>300元</td>
                                </tr>

                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>

    </div>
    </div>
</div>

<script type="text/javascript" src="__STATIC__/echarts/echarts.min.js"></script>
<script>
    layui.use('carousel', function(){
        var carousel = layui.carousel;
        //建造实例
        carousel.render({
            elem: '#test1'
            ,width: '100%' //设置容器宽度
            ,arrow: 'none' //始终显示箭头
            ,anim: 'updown' //切换动画方式
            ,interval:1000
        });
    });
    function show_shopm(t) {
        var row = $(t).attr('data-d'); //获取显示内容
        //小tips
        layer.tips(row, t, {
            tips: [1, '#3773ca'],
            time: 4000
        })
    }

</script>
{/block}